<template>
  <div class="home">
    home 组件
    <div>
      <ul class="list">
        <li v-for="(item,index) in this.$store.state.state1.products" :key="index">
          <img :src="item.imgsrc" alt=""/>
          <button @click="addfn(item)">加入购物车</button>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src


export default {
  name: "Home",
  components: {
  },
  methods:{
    addfn(item){
      console.log(item)
      this.$store.dispatch('addcart',item)
    }
  },
  created(){
    // 获取商品页数据
    this.$store.dispatch("getProducts")
  },
  mounted(){
    console.log(this)
  }
};
</script>
<style scoped>
ul,li{
  list-style:none;
  margin:0;
  padding: 0;
}
.list{
  display: flex;
}
</style>
